<template>
    <div id="publish-business">
      <!-- 导航栏 -->
      <van-nav-bar @click-left="back" class="navbar">
        <template #left>
          <van-icon name="arrow-left" size="18" color="#f7f8fa" />
        </template>
        <template #title>
          <div name="arrow-left" class="title">发布交易</div>
        </template>
      </van-nav-bar>

      <!-- 菜单 -->
      <van-grid clickable :column-num="2" class="grid">
        <van-grid-item icon="shopping-cart-o" text="发布购买" to="/publish/buy" />
        <!--<van-grid-item icon="shop-o" text="发布出售" to="/publish/sell" />-->
        <van-grid-item icon="shop-o" text="发布出售" @click="toast" />
      </van-grid>
    </div>
</template>

<script>
  import store from '@/store'
  import Vue from 'vue';
  import { Toast } from 'vant';

  Vue.use(Toast);

  export default {
    name: "PublishBusiness",
    data() {
      return {
        store: store,
      };
    },
    methods: {
      back() {
        store.state.mine.showPopup = false;
        this.$router.back(-1);
      },
      toast() {
        Toast({
          message: '暂未开放',
          position: 'bottom',
        });
      }
    },
    destroyed: function () {
      // 处理页面按回退键时页面空白的问题
      store.state.mine.showPopup = false;
    },
  }
</script>

<style scoped>
  .navbar {
    background-color: #545c80;
  }
  .title {
    color: #f7f8fa;
    font-size: 14px;
  }
  .grid {
    margin-top: 10px;
  }
</style>
